import React from 'react';
import './App.css'
import Button, { ButtonType, ButtonSize, ButtonShape, GradientDirection, ButtonHover } from './components/Button/button'
import Menu from './components/Menu/menu'
function App() {
  return (
    <div className="App" style={{ margin: '200px' }}>
      <a href="#/">你好，YBUI！</a>
      <Button btnType={ButtonType.Danger}>按钮</Button>
      <Button
        btnType={ButtonType.Gradient}
        size={ButtonSize.Large}
        gradient={
          {
            bgColor: '#03a9f4, #f441a5,#ffeb3b,#03a9f4',
            direction: GradientDirection.ToRight,
            flow: true
          }
        }
      >按钮</Button>
      <Button
        btnType={ButtonType.Gradient}
        size={ButtonSize.Large}
        gradient={{ bgColor: '#03f4b8, #11e0d6e4,#16f057ea,#03f4b8', direction: GradientDirection.ToRight }}
      >按钮</Button>
      <Button
        btnHover={ButtonHover.Fault}
        size={ButtonSize.Large}
        btnType={ButtonType.Success}
        clipRandom
        clipColor='#f441a5 #ffeb3b'
      >赛博朋克</Button>
      <Button
        btnHover={ButtonHover.Frame}
        size={ButtonSize.Large}
        btnType={ButtonType.Success}
        borderColor='#f441a5'
      >边框</Button>
      <Button btnShape={ButtonShape.Circle}>圆角按钮66666</Button>
      <Button
        btnType={ButtonType.Primary}
        size={ButtonSize.Large}
      >按钮大</Button>
      <Button btnType={ButtonType.Success} size={ButtonSize.Small}>按钮小</Button>
      <Button disabled>按钮</Button>
      <Menu></Menu>
    </div>
  );
}

export default App;
